import React, { useState } from 'react'
import { ItemContainer,List} from './style'
import ListItem from './listitem/ListItem.jsx'
import Scroll from '@/baseUI/scroll'
import { useHistory } from 'react-router-dom'


const ListData = (props) => {
    // 示例图片 为了后面详情页和购物车页面的示例
    const example = [
        {
           "imgsrc": "https://yanxuan-item.nosdn.127.net/9fb79a3553828a118d7b9f1f202ee662.jpg?imageView&thumbnail=0x750",
            "id":3,
            "title":"Sense感官之息系列香薰蜡烛组合",
            "price":"199",
            "rotationImg":[
                "https://yanxuan-item.nosdn.127.net/4b0279811ed94329dab4f82b4aaa1bd4.png?imageView&thumbnail=0x750",
                "https://yanxuan-item.nosdn.127.net/68a34fd53d92e19d7893817d0eabc671.png?imageView&thumbnail=0x750",
                "https://yanxuan-item.nosdn.127.net/84ab1cabf8eeb245d225f2660836cf90.png?imageView&thumbnail=0x750",
                "https://yanxuan-item.nosdn.127.net/0642528d7759f13b11e7c69718eacab7.png?imageView&thumbnail=0x750",
                "https://yanxuan-item.nosdn.127.net/f38caf96987777133ceb05af10c505df.jpg?quality=35&thumbnail=345x345&imageView"
            ]
       },
        {
           "imgsrc": "https://yanxuan-item.nosdn.127.net/f7d109bd97355c3d0ad2e05532df331f.png?imageView&thumbnail=0x150",
            "id":4,
            "title":"甜甜的糖果味女式轻量双肩包",
            "price":"42"
       }
    ]
    const { list } = props
    return (
        <>
            <ItemContainer item={List} key={list}>
                <ListItem item={example[0]} key={example[0].id} />
                <ListItem item={example[1]} key={example[1].id} />
                {
                    list.map((item) => (
                        <ListItem item={item} key={item.id} />
                    ))
                }
            </ItemContainer>
        </>
    )
}
export default ListData